body,html{
    height: 100%;
}
.content{
    position: relative;
    height: 100%;
    background-color: #f2f2f2;
    overflow: hidden;
}
.yudi{
    position: absolute;
    opacity: 0;
    animation: drops 1.2s cubic-bezier(.54,.02,.51,.25) infinite;
    width: 60px;
    height: 60px;
    background-image: url(../img/hongbao.png);
    background-size: auto 60px;
}
/**
.yudi{
    position: absolute;
    opacity: 0;
    animation: drops 1.2s cubic-bezier(.54,.02,.51,.25) infinite;
    // 红包
    width: 60px;
    height: 60px;
    background-image: url(../img/hongbao.png);
    background-size: auto 60px;
    // 雨滴
    width: 4px;
    height: 6px;
    background-color: rgba(243, 118, 176, 0.555);
    clip-path: ellipse(10% 30% at 50% 60%);
    transform: scale(2);
    
    background-size: auto 60px;
}*/

@keyframes drops{
    0%{
        opacity: 0;
    }
    20%{
        opacity: 1;
    }
    90%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: translate3d(10px,100vh,-10px);
    }
}